<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@ page contentType="text/html;charset=UTF-8"%>
<%@ taglib uri="/struts-tags" prefix="s"%>
<%
	String path = request.getContextPath();
	String basePath = request.getScheme() + "://"
			+ request.getServerName() + ":" + request.getServerPort()
			+ path + "/";
%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
    <base href="<%=basePath%>">
    <title></title>
    <link id="skin_css" rel="stylesheet" type="text/css" href="themes/css/ui.c.blue.css" />
    <link href="themes/css/ui.common.css" rel="stylesheet" type="text/css" />
	<link href=" themes/css/ui.child.css" rel="stylesheet" type="text/css" />
	<link href=" themes/css/ui.tips.css" rel="stylesheet" type="text/css" />
    <link href="themes/css/ui.c.blue.css" rel="stylesheet" type="text/css" />
    <link href="style/jquery_ui/jquery-ui-1.8.custom.css" rel="stylesheet" type="text/css" />
    <link rel="stylesheet" href="style/checkboxTree/checktree.css" type="text/css" />
    <script src="Scripts/jquery-1.4.1.min.js" type="text/javascript"></script>
    <script src="Scripts/jquery.json-2.2.min.js" type="text/javascript"></script>
    <script src="Scripts/jquery-ui-1.8.custom.min.js" type="text/javascript"></script>
    <script src="Scripts/ui.tips.js" type="text/javascript"></script>
    <script src="Scripts/ui.default.js " type="text/javascript" charset="UTF-8"></script>
    <script src="Scripts/ui.admincp.js" type="text/javascript" charset="UTF-8"></script>
    <script type="text/javascript" src="style/checkboxTree/data/jquery.checktree.js"></script>
	<script type="text/javascript">
        var treeContainerId = "#limitInfoTree";
        $(function () {
            $("ul.tree").checkTree({});
            obtainLimitIds();
            onSectionChange();
            OnPostChange();
        });

        function representLimitInfoTree(limitIds) {
            $(limitIds).each(function (index) {
                $(treeContainerId).find('input[value="' + limitIds[index] + '"]').prev(".checkbox").click();
            });

        }

        function onSectionChange() {
            $("#ddl_SectionSelector").change(function () {
                //to load Post For Section
				var sectionId = $(this).val();
				 
                $.post("postLimit!queryPostBySection.action", { sectionId: sectionId }, function (data) {
      
                    var postArr =  eval($.toJSON(data));
 
                    var result = foreachHandler(postArr, function (item) {
                        return '<option value="' + item.postId + '">' + item.postName + '</option>';
                    });

                    $("#ddl_postListForOneSection").html("").append(result);

                }, "json");

            });
        }

        function OnPostChange() {
            $("#ddl_postListForOneSection").change(function () {
                var postId = $(this).val(); 
                  resetTree();resetTree();
                $.post("postLimit!mainActionCalledFromAjax.action", { postId: postId }, function (data) {
                    
                    var limitInfoList = eval(data); 
                    if (limitInfoList != null && limitInfoList.length > 0) {
                      
                        representLimitInfoTree(limitInfoList);
                    }
                    // end
                }, "text");
            });
        }

        function resetTree() {
            $(treeContainerId).find(".checked").click();
       
            $(".parentNode").prev(".checked").click();
        }

        function obtainLimitIds() {
            $("#btnSavePostLimitIds").click(function () {
                var limitItems = $(".checked~input,.half_checked~input");
                var result = "";
                limitItems.each(function (item) {
                    result += $(this).val() + ",";
                });
                result = result.substring(0,result.length-1);
                
                return postToServer(result);
            });

        }

        function postToServer(limitIds) {
            var postId = $("#ddl_postListForOneSection").val();
            // a action to submit limitIds for one PostId
            $.post("postLimit!addOrModify.action", { postId: postId, limitIds: limitIds }, function (data) {
                if(data=="success"){$("#tips").text("操作成功");}
                else{$("#tips").text("操作失败");}
            }, "text");
        }
    </script>
</head>
<body>
	<div class="PageChild_Title">
			<img src=" themes/images/default/icons/archives.png" class="PageChild_Tbtnpic" />
			<span class="PageChild_separate"></span>
			<span class="PageChild_TbtnText"><h2>管理权限</h2></span>
			<span class="PageChild_separate"></span>
			<div id="marker" class="red-tips">
			</div>
			<div class="clear">
			</div>
	</div>
	<div class="PageChild_Where">
    <table style="" border="0" cellpadding="0" width="600" cellspacing="0" align="center">
        <tr class="partition">
            <td colspan="3">
                
                <div id="tipsDesk" style="height: 26px;">
                    &nbsp;
                </div>
            </td>
        </tr>
        <tr>
             <td valign="top">
                	所属部门：<br/>
                <s:select list="sectionList" listKey="sectionId" listValue="sectionName" headerKey="" headerValue="-请选择-" id="ddl_SectionSelector" name="sectionId" theme="simple" cssClass="clearable" cssStyle="width: 240px" value="sectionId"></s:select>
                <br />
                 	所属职位：<br/>
                 <s:select list="#{'':'-请先选择部门-'}" id="ddl_postListForOneSection" name="postId" theme="simple" cssClass="clearable" cssStyle="height: 360px; width: 240px;" value="postId" size="10"></s:select>
                 <br/>
                <input type="button" id="btnSavePostLimitIds" value="保存" />&nbsp; <input type="button" id="btnResetTree" value="取消"   onclick="resetTree();resetTree();" /><br />
                <span id="tips"></span>
            </td>
            <td width="8px" align="left" valign="middle">
                &nbsp;&nbsp;&nbsp;
            </td>
            <td style="width: 100%" valign="top">
                <div>
                	权限列表:<br/>
                    ${str}
                </div>
            </td>
        </tr>
    </table>
    </div>
</body>
</html>